import { ref } from "vue";
import { ElMessageBox } from "element-plus";
import { useLocalStorage } from "@vueuse/core";
import _ from "lodash";
const is_need_open_ring = ref(false);
const isOpenPlayRing = useLocalStorage("is_open_play_ring", true);
//必须在播放铃声之前保证有一次交互
//触发交互
const clickRing = () => {
  const ringDom = document.querySelector("#ring");
  ringDom.pause();
};
//播放铃声
const playRing = _.throttle(async () => {
  const ringDom = document.querySelector("#ring");
  try {
    await ringDom.play();
  } catch (error) {
    if (!is_need_open_ring.value) {
      openRing();
    }
  }
}, 3000);

//请求播放权限
const openRing = () => {
  is_need_open_ring.value = true;
  ElMessageBox.confirm("您是否确认开启消息铃声?", "温馨提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning"
  }).then(async () => {
    clickRing();
  });
};
export { isOpenPlayRing, playRing };
